<!--
 * @Author:赖钊亮
 * @Description: 重置密码界面
 * @Date: 2020-07-01 14:14:08
 * @LastEditTime: 2020-07-03 11:29:42
 * @LastEditors: Please set LastEditors
 * @FilePath: \mobile_item_121e:\新建文件夹\jkshopping\src\pages\my\components\eeset.vue
--> 
<template>
  <div>
    <!--重置密码顶部 -->
    <van-nav-bar title="重置密码" left-text="返回" left-arrow @click-left="goBack" />

    <!-- 重置密码 -->
    <div>
      <van-form @submit="onSubmit">
        <van-cell-group>
          <van-field
            label="手机号"
            v-model="phone"
            placeholder="请输入手机号码"
            name="phone"
            :rules="[{required: true, message: '请填写手机号码'}]"
          />
        </van-cell-group>
        <van-field
          center
          clearable
          label="短信验证码"
          name="code"
          v-model="code"
          placeholder="请输入短信验证码"
          :rules="[{ required: true, message: '请检查手机号码是否正确' }]"
        >
          <template #button>
            <van-button size="small" type="primary" @click="Code">验证码</van-button>
          </template>
        </van-field>
        <van-field
          v-model="pwd"
          type="password"
          name="密码"
          label="密码"
          placeholder="密码"
          :rules="[{ required: true, message: '请填写密码' }]"
        />
        <br />
        <van-button round block type="info" native-type="submit">注册</van-button>
        <br />
      </van-form>
    </div>
  </div>
</template>

<script>
import * as api from "@/api/apiList/user/user.js";
export default {
  data() {
    return {
      phone: "",
      code: "",
      pwd: ""
    };
  },
  methods: {
    goBack() {
      this.$router.go(-1);
    },
    // 校验手机号码是否正确
    onSubmit(values) {
      if (/^1[3456789]\d{9}$/.test(values.phone)) {
        this.$dialog
          .alert({
            title: "修改成功"
          })
          .then(async () => {
            // let res = await this.API_login();
            // if (res.data.code === 200) {
            //   this.CHANGESIGN_TOKEN(res.data.data.access_token);
            // }
            // this.$router.push("/my");
          });
      } else {
        this.$dialog
          .alert({
            title: "修改失败"
          })
          .then(() => {});
      }
    },
    // 获取验证码接口数据
    async API_code(mobile) {
      let params = {
        mobile,
        type: 2
      };
      return await api.code(params);
    },

    // 获取验证码
    async Code() {
      let res = await this.API_code(this.phone);
      this.code = res.data.data.code;
      this.$dialog
        .alert({
          title: "验证码",
          message: this.code
        })
        .then(() => {});
    },
    // 校验验证码接口
    async API_checkCode(mobile, code) {
      let data = {
        mobile,
        code,
        type: 2
      };
      return await api.checkCode(this.qs.stringify(data));
    },
    // 重置密码接口
    async API_editPwd() {
      let data = {
        password: this.pwd,
        mobile: this.phone,
        code: this.code
      };
      return await api.editPwd(this.qs.stringify(data));
    }
  },
  async created() {
    let res = await this.API_editPwd();
    console.log(res);
  }
};
</script>

<style>
</style>